<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <script src="../static/layui.js" charset="utf-8"></script>
    <link rel="stylesheet" href="../static/css/layui.css" media="all">

</head>

<body  class="kit-theme">

<div class="layui-layout layui-layout-admin kit-layout-admin">



    <div class="layui-header">
        <div class="layui-logo">权限管理系统</div>
        <ul  class="layui-nav layui-layout-left" id="nav-container" >

        </ul>
    </div>

    <div class="layui-side layui-bg-black kit-side">
        <div class="layui-side-scroll">
            <div class="kit-side-fold"><i class="fa fa-navicon" aria-hidden="true"></i></div>
            <ul class="layui-nav layui-nav-tree" lay-filter="kitNavbar" kit-navbar>
                <li class="layui-nav-item layui-nav-itemed" id="left-container" >
                </li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;" id="contain">

        </div>
       </div>





        <div class="layui-footer">
            我是有底线的！
        </div>
    </div>

</div>

<script src="../static/layui.js" charset="utf-8"></script>



<script id="nav" type="text/html">
    {{# layui.each(d.data, function(index, item){ }}
    <li class="layui-nav-item"><a id="aa" href="#" onclick="showNavItem('{{item.id}}');return false;" >{{ item.title }}</a>
    </li>
    {{#  }); }}
</script>

<script id="nav1" type="text/html">
    <dl class="layui-nav-child"  >
    {{# layui.each(d.data, function(index, item){ }}
    <dd><a kit-target onclick="getContent('{{item.url}}')" href="#"> <i class="layui-icon">&#xe6c6;</i>{{item.title}}</a></dd>
    {{#  }); }}</dl>
</script>


<script type="text/javascript">
    layui.use(['table', 'form', 'jquery', 'laytpl', 'element'], function (table, form, $, laytpl, element) {

        var controller = function () {
            var container = $("#nav-container")
            $.ajax({
                url: "http://localhost:8080/rbac-rest-service/rbac/menu/menuUserId/"+sessionStorage.userid+"?userid="+sessionStorage.userid+"&sign="+sessionStorage.token,
                success: function (data) {
                    laytpl($('#nav').html()).render(data, function (html) {
                        container.html(html);
                    });
                }
                , dataType: 'json'
            });
        };
        controller();
    });

    function showNavItem(arg) {
        layui.use(['jquery', 'laytpl'], function ($, laytpl) {
            var container = $("#left-container")
            $.ajax({
                url: "http://localhost:8080/rbac-rest-service/rbac/menu/p/"+arg+"?userid="+sessionStorage.userid+"&sign="+sessionStorage.token,
                success: function (data) {
                    laytpl($('#nav1').html()).render(data, function (html) {
                        container.html(html);
                    });
                }
                , dataType: 'json'
            });
        });
    };
</script>

<script type="text/javascript">
    function getContent(url) {
        layui.use(['laytpl','jquery'],function(laytpl,$) {
            $("#contain").load("http://localhost:63342/web2017/rbac-web-client/LoginView/"+url,function(){})
        });
    }

</script>

<script>
    var message;
    layui.config({
        base: 'build/js/'
    }).use(['app', 'message'], function() {
        var app = layui.app,
            $ = layui.jquery,
            layer = layui.layer;
        //将message设置为全局以便子页面调用
        message = layui.message;
        //主入口
        app.set({
            type: 'iframe'
        }).init();
        $('#pay').on('click', function() {
            layer.open({
                title: false,
                type: 1,
                content: '<img src="/build/images/pay.png" />',
                area: ['500px', '250px'],
                shadeClose: true
            });
        });
    });
</script>
</body>


</html>